<script setup lang="ts">
import { ref } from 'vue'
import type { Introductions } from '@/types/home'
import { loadIntroductionsDetailsUsingGet, loadIntroductionsUsingGet } from '@/services/home'
import uParse from '@/components/gaoyia-parse/parse'
import { onLoad } from '@dcloudio/uni-app'

const introductions = ref<Introductions>()
const query = defineProps<{ id: string }>()
const loadIntroductionsDetailsUsingGetData = async () => {
  const res = await loadIntroductionsDetailsUsingGet(query.id)
  introductions.value = res.data
}

onLoad(() => {
  loadIntroductionsDetailsUsingGetData()
})
</script>
<template>
  <view class="Introductions">
    <view class="introductions-main-title">
      <view class="introductions-sub-title">{{ introductions.introTitle }}</view>
      <u-parse :content="introductions.introContent" />
    </view>
  </view>
</template>

<style lang="scss">
.introductions-main-title {
  font-size: 32px;
  color: #2c3e50;
  margin-top: 20px;
}

.introductions-sub-title {
  font-size: 23px;
  color: #2980b9;
  margin-top: 20px;
  font-weight: 500;
  text-align: center;
}
</style>
